<template>
  <el-dialog title="手动导入案例" :visible.sync="option.isShow" width="70%" :close-on-click-modal="false" @open="openDialog"
    @close="closeDialog('ruleForm')">
    <el-row :gutter="10">
      <el-form :model="ruleForm" size="small" :rules="rules" ref="ruleForm" label-width="100px" class="demo-ruleForm">
        <!-- <el-col :span="18">
            <el-form-item label="案例编号" prop="CASENO">
              <el-input size="small" placeholder="请输入案例编号" v-model="ruleForm.CASENO"></el-input>
            </el-form-item>
          </el-col> -->
        <el-col :span="18">
        <el-form-item label="渠道" prop='CHANNELTYPE'>
          <el-select v-model="ruleForm.CHANNELTYPE" filterable clearable placeholder="请选择业务渠道" size="small">
            <el-option v-for="item in channelOption" :key="item.FIELDKEY" :label="item.FIELDVALUE"
              :value="item.FIELDKEY"></el-option>
          </el-select>
        </el-form-item>
        </el-col>
        <el-col :span="18">
          <el-form-item label="案例名称" prop="CASENAME">
            <el-input size="small" placeholder="请输入案例名称" v-model="ruleForm.CASENAME"></el-input>
          </el-form-item>
        </el-col>

        <el-col :span="18">
          <el-form-item label="案例类型" prop="CASETYPE">
            <el-select v-model="ruleForm.CASETYPE" filterable clearable placeholder="请选择案例类型" size="small">
              <el-option v-for="(item,index) in option.caseTypeOption" :key="index" :label="item.code+'—'+item.val"
                :value="item.code"></el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <!-- <el-col :span="18">
            <el-form-item label="生成方式" prop="CREATETYPE">
              <el-select v-model="ruleForm.CREATETYPE" filterable clearable placeholder="请选择生成方式">
                <el-option v-for="(item,index) in option.creatTypeOption" :key="index" :label="item.code+'—'+item.val" :value="item.code"></el-option>
              </el-select>
            </el-form-item>
          </el-col> -->
        <!-- <el-col :span="18">
            <el-form-item label="任务ID" prop="TASKID">
              <el-select v-model="ruleForm.TASKID" filterable clearable placeholder="请选择任务ID">
                <el-option v-for="(item,index) in taskIdOption" :key="index" :label="item.val" :value="item.val"></el-option>
              </el-select>
            </el-form-item>
          </el-col> -->
        <el-col :span="18">
          <el-form-item label="文件类型" prop="FILETYPE">
            <el-select v-model="ruleForm.FILETYPE" filterable clearable placeholder="请选择文件类型" size="small">
              <el-option v-for="(item,index) in option.fileTypeOption" :key="index" :label="item.code+'—'+item.val"
                :value="item.code"></el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="18">
          <el-form-item label="案例描述" prop="CASEDESC">
            <el-input v-model="ruleForm.CASEDESC" placeholder="请输入案例描述" :rows="4"></el-input size="small">
          </el-form-item>
        </el-col>
        <el-col :span="18">
          <el-form-item label="选择文件">
            <el-upload class="upload-demo" :action="fileUrl" :on-preview="handlePreview"
              :on-success="handleAvatarSuccess" :on-remove="handleRemove" :limit="1" :on-exceed="handleExceed"
              :before-upload="beforeAvatarUpload" accept=".AVI,.mov,.wav,.rmvb,.rm,.FLV,.mp4,.3GP,.mp3,.txt"
              :file-list="fileList">
              <el-button size="small" type="primary" :disabled="ruleForm.CHANNELTYPE == '' || ruleForm.FILETYPE == ''">点击上传</el-button>
              <div slot="tip" class="el-upload__tip">请先选择渠道和文件类型。注：只能上传视频、音频或文本文件</div>
            </el-upload>
          </el-form-item>
        </el-col>
        <el-col :span="18">
          <el-form-item label="文件名称" prop="FILENAME">
            <el-input size="small" disabled placeholder="请输入文件名称" v-model="ruleForm.FILENAME"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="18">
          <el-form-item label="创建人" prop="CREATER">
            <el-input size="small" placeholder="请输入创建人" disabled v-model="ruleForm.CREATER"></el-input>
          </el-form-item>
        </el-col>
        <!-- <el-col :span="18">
            <el-form-item label="格式" prop="FILEFORMAT">
              <el-select v-model="ruleForm.FILEFORMAT" filterable clearable placeholder="请选择格式">
                <el-option v-for="(item,index) in option.fileFormatOption" :key="index" :label="item.val" :value="item.val"></el-option>
              </el-select>
            </el-form-item>
          </el-col> -->


        <el-col :span="24">
          <el-form-item>
            <el-button type="primary" size="mini" @click="submitForm('ruleForm')">保存</el-button>
            <el-button @click="resetForm('ruleForm')" size="mini">重置</el-button>
          </el-form-item>
        </el-col>
      </el-form>
    </el-row>
  </el-dialog>
</template>

<script>
  import request from "@/common/utils/requestQC";
  import getGlobalParams from "@/common/utils/getGlobalParams";
  import addData from "@/message/QCManage/caseManage/caseManualAdd";
  import Query from '@/message/QCManage/taskAssignment/taskAssignmentDetail/taskAssignmentDetail';
  import dictionary from '@/message/wfm/baseData/dictionaryManage/dictionaryQuery'
  import requestWFM from "@/common/utils/requestWFM";
  import pathCheck from "@/message/QCManage/caseManage/pathCheck";

  export default {
    props: {
      option: Object
    },
    computed: {
      isShow: {
        get: function () {
          return this.option.isShow;
        },
        set: function (newValue) {
          this.option.isShow = newValue;
        }
      }
    },
    mounted() {
      // this.queryDetail();
      this.dictionaryQuery('CHANNELTYPE').then(value => this.channelOption = value);

    },
    data() {
      return {
        channelOption: [], //渠道类型
        fileUrl: getGlobalParams.get("uploadAddress"),
        fileList: [],
        ruleForm: {
          CHANNELTYPE: '',//渠道
          CASENO: '',
          CASENAME: '',
          CASEDESC: '',
          CASETYPE: '',
          CREATETYPE: '0',
          TASKID: '',
          FILETYPE: '',
          FILENAME: '',
          CREATER: this.$store.getters.UserNum,
          FILEFORMAT: ''
        },
        tableData: [],
        taskIdOption: [],
        OPERABEGINDATE: this.getDay(-15),
        OPERAENDDATE: this.getDay(15),
        rules: {
          CASENAME: [{
            required: true,
            message: '请输入案例名称',
            trigger: 'change'
          }],
          CASEDESC: [{
            required: true,
            message: '请输入案例描述',
            trigger: 'change'
          }],
          CASETYPE: [{
            required: true,
            message: '请输入案例类型',
            trigger: 'change'
          }],
          CHANNELTYPE: [{
            required: true,
            message: '请选择渠道类型',
            trigger: 'change'
          }],
          CREATETYPE: [{
            required: true,
            message: '请输入生成方式',
            trigger: 'change'
          }],
          TASKID: [{
            required: true,
            message: '请输入任务ID',
            trigger: 'change'
          }],
          FILETYPE: [{
            required: true,
            message: '请输入文件类型',
            trigger: 'change'
          }],
          FILENAME: [{
            required: true,
            message: '请输入文件名称',
            trigger: 'change'
          }],
          CREATER: [{
            required: true,
            message: '请输入创建人',
            trigger: 'change'
          }],
          FILEFORMAT: [{
            required: true,
            message: '请输入格式',
            trigger: 'change'
          }]

        },
        loading: false,

      };
    },
    created() {

    },
    methods: {
      async dictionaryQuery(type) {
        let resBody = new dictionary();
        resBody.data.FIELDCODE = type
        resBody.data.CurrPage = 1
        resBody.data.PageRowNum = 400
        let response = await requestWFM(resBody);
        if (response.SYS_HEAD.ReturnCode == "000000") {
          return response.BODY.FIEDATA;
        } else {
          this.$message({
            type: "error",
            message: "请求失败，错误码:" + response.SYS_HEAD.ReturnCode + "，错误信息：" + response.SYS_HEAD.ReturnMessage
          })
        }
      },
      handleAvatarSuccess(res, file) {
        this.ruleForm.FILENAME = file.name
      },
      async beforeAvatarUpload(file) {
        // const isType= file.type === 'AVI/mov/rmvb/rm/FLV/mp4/3GP/mp3/txt';
        const isLt10M = file.size / 1024 / 1024 < 10;

        // if (!isJPG) {
        //   this.$message.error('请选择正确的格式，只能上传视频、音频或文本文件!');
        // }
        if (!isLt10M) {
          this.$message.error('上传头像图片大小不能超过 10MB!');
          return isLt10M
        }
        let date=new Date()
        let y = date.getFullYear()
        let m = date.getMonth() + 1
        m = m < 10 ? '0' + m : m
        let d = date.getDate()
        d = d < 10 ? ('0' + d) : d
        let currentDate = y + m + d
        this.fileUrl = getGlobalParams.get("uploadAddress")
        let resBody = new pathCheck();
        resBody.data.FILEPATH = 'ZJGL/'+this.ruleForm.FILETYPE+'/'+this.ruleForm.CHANNELTYPE+'/'+currentDate
        let response = await request(resBody);
        if (response.SYS_HEAD.ReturnCode == "000000") {
          var reg = new RegExp( '/' , "g" )
          this.ruleForm.FILEPATH = response.BODY.PATH
          this.fileUrl += '/'+ response.BODY.PATH.replace(reg,'_')
          console.log(this.fileUrl)
        } else {
          this.$message({
            type: "error",
            message: "请求失败，错误码:" + response.SYS_HEAD.ReturnCode + "，错误信息：" + response.SYS_HEAD.ReturnMessage
          })
        }
      },
      handleRemove(file, fileList) {
        console.log(file, fileList);
      },
      handlePreview(file) {
        console.log(file);
      },
      handleExceed(files, fileList) {
        this.$message.warning(`当前限制选择 1 个文件，本次选择了 ${files.length} 个文件，共选择了 ${files.length + fileList.length} 个文件`);
      },
      // beforeRemove(file, fileList) {
      //   return this.$confirm(`确定移除 ${ file.name }？`);
      // },
      openDialog() {
        if (this.$refs['ruleForm'] != undefined) {
          this.$refs['ruleForm'].clearValidate();
        }
      },
      closeDialog(formName) {
        if (this.$refs[formName] != undefined) {
          this.$refs[formName].clearValidate();
        }
        // this.$refs[formName].clearValidate();
        this.$refs[formName].resetFields();
      },
      //保存
      submitForm(formName) {
        this.$refs[formName].validate(async (valid) => {
          if (valid) {
            let resBody
            resBody = new addData();
            resBody.data.CASENO = ''
            resBody.data.CASENAME = this.ruleForm.CASENAME
            resBody.data.CASEDESC = this.ruleForm.CASEDESC
            resBody.data.CASETYPE = this.ruleForm.CASETYPE
            resBody.data.CREATETYPE = this.ruleForm.CREATETYPE
            // resBody.data.TASKID = this.ruleForm.TASKID
            resBody.data.FILETYPE = this.ruleForm.FILETYPE
            resBody.data.FILENAME = this.ruleForm.FILENAME
            resBody.data.CREATER = this.ruleForm.CREATER
            // resBody.data.FILEFORMAT = this.ruleForm.FILEFORMAT
            resBody.data.FILEPATH = this.ruleForm.FILEPATH
            let response = await request(resBody);
            if (response.SYS_HEAD.ReturnCode == "000000") {
              this.$message({
                type: 'success',
                message: '新增成功！'
              })
              this.isShow = false;
              this.$emit("refreshTable");
            } else {
              this.$message({
                type: "error",
                message: "请求失败，错误码:" + response.SYS_HEAD.ReturnCode + "，错误信息：" + response.SYS_HEAD
                  .ReturnMessage
              })
            }
          } else {
            console.log('error submit!!');
            return false;
          }
        });
      },
      resetForm(formName) {
        if (this.$refs[formName] != undefined) {
          this.$refs[formName].clearValidate();
          this.$refs[formName].resetFields();
        }
      },
      // 任务分发明细查询
      async queryDetail() {
        let resBody = new Query()
        resBody.data.QUALITER = ''
        resBody.data.BATCHNO = ''
        resBody.data.TASKSTATUS = '1'
        resBody.data.OPERABEGINDATE = this.OPERABEGINDATE
        resBody.data.OPERAENDDATE = this.OPERAENDDATE
        resBody.data.PageFlag = 4
        resBody.data.CurrPage = 1
        resBody.data.PageRowNum = 10
        let response = await request(resBody);
        if (response.SYS_HEAD.ReturnCode == "000000") {
          console.log("====查询taskid成功====");
          this.tableData = response.BODY.RSPSTRUCT;
          console.log("tabledata==" + JSON.stringify(this.tableData));
          for (let i = 0; i < this.tableData.length; i++) {
            console.log('taskId===' + this.tableData[i].TASKID)
            this.taskIdOption.push({
              'code': i,
              'val': this.tableData[i].TASKID
            })
          }
          console.log('taskIdOption===' + JSON.stringify(this.taskIdOption))
        } else {
          console.log("====查询taskid失败====");
          this.$message({
            type: "error",
            message: "请求失败，错误码:" + response.SYS_HEAD.ReturnCode + "，错误信息：" + response.SYS_HEAD.ReturnMessage
          })
        }
      },
      getDay(day) {
        var dd = new Date();
        dd.setDate(dd.getDate() + day);
        var y = dd.getFullYear();
        var m = dd.getMonth() + 1 < 10 ? "0" + (dd.getMonth() + 1) : dd.getMonth() + 1;
        var d = dd.getDate() < 10 ? "0" + dd.getDate() : dd.getDate();
        return y + "" + m + "" + d;
      },
    }
  };

</script>

<style rel="stylesheet/scss" lang="scss" scoped>
</style>
